import { Table } from "antd";
import dayjs from "dayjs";
import React from "react";
import copy from "copy-to-clipboard";
const table = () => {
    const month = '2025-01'
    const autoColumns = (list) => {
        return list?.length && Object.keys(list[0]).map(key => {
            return {
                title: key,
                dataIndex: key,
                key,
                onCell: (record) => {
                    const { month: currentMonth } = record
                    const target = dayjs(month)
                    if(target === dayjs(currentMonth)) {
                        return {
                            style: {
                                background: 'yellow'
                            }
                        }
                    }
                },
            }
        })
    }
    const dataSource = [
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        },
        {
            year: 2025,
            '2025-01': 9999,
            '2025-02': 9999,
            '2025-03': 9999,
            '2025-04': 9999,
            '2025-05': 9999,
            '2025-06': 9999,
            '2025-07': 9999,
            '2025-08': 9999,
            '2025-09': 9999,
            '2025-10': 9999,
            '2025-11': 9999,
            '2025-12': 9999
        }
    ]
    const columns = autoColumns(dataSource)
    const components = {
        header: {
            cell: (props) => {
                const { children, title, style } = props
                console.log(props.children[1], title, children);
                return <th {...props} style={{ ...style }}>{children}</th>
            }
        }
    }
    return <Table dataSource={dataSource} columns={columns} pagination={false} components={components} bordered />
}

export default table